<!--
  -  Copyright 2021 Huawei Technologies Co., Ltd.
  -
  -  Licensed under the Apache License, Version 2.0 (the "License");
  -  you may not use this file except in compliance with the License.
  -  You may obtain a copy of the License at
  -
  -      http://www.apache.org/licenses/LICENSE-2.0
  -
  -  Unless required by applicable law or agreed to in writing, software
  -  distributed under the License is distributed on an "AS IS" BASIS,
  -  WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
  -  See the License for the specific language governing permissions and
  -  limitations under the License.
  -->

<template>
  <div class="appTest">
    <div class="appTestTop">
      <p class="appTestTitle" />
      <button
        class="backAppStore"
        @click="jumpToMyapp()"
      >
        {{ $t('store.backMyApp') }}
      </button>
    </div>
    <iframe
      title="atp"
      :src="srcUrl"
      name="atp"
      class="atp"
      ref="iframe"
    />
  </div>
</template>

<script>
import { common } from '../../tools/comon.js'
import { myApp } from '../../tools/api.js'
import { PLATFORMNAME_ATP } from '../../tools/constant.js'
export default {
  name: 'Task',
  data () {
    return {
      srcUrl: '',
      taskId: '',
      packageId: '',
      appId: '',
      language: localStorage.getItem('language'),
      iframeWin: {},
      testAgain: '' || sessionStorage.getItem('testAgain')
    }
  },
  methods: {
    searchAppTestAciton () {
      myApp.getPackageDetailApi(this.appId, this.packageId).then(res => {
        this.srcUrl = common.getPlatformUrlPrefix(PLATFORMNAME_ATP)
        if (this.testAgain === 'true') {
          this.srcUrl = this.srcUrl + '/#/selectscene' + '?taskId=' + this.taskId
        } else {
          if (res.data.status === 'Test_success' || res.data.status === 'Test_failed') {
            this.srcUrl = this.srcUrl + '/#/atpreport' + '?taskid=' + this.taskId
          } else if (res.data.status === 'Test_running') {
            this.srcUrl = this.srcUrl + '/#/atpprocess' + '?taskId=' + this.taskId
          } else {
            this.srcUrl = this.srcUrl + '/#/selectscene' + '?taskId=' + this.taskId
          }
        }
        this.srcUrl = this.srcUrl + '&language=' + this.language
      }).catch((error) => {
        console.log(error)
      })
    },
    jumpToMyapp () {
      this.$router.push('/myapp')
    },
    sendLanguageMessage () {
      this.iframeWin.postMessage({
        cmd: 'iframeLanguageChange',
        params: { lang: localStorage.getItem('language') }
      }, '*')
    }
  },
  mounted () {
    this.iframeWin = this.$refs.iframe.contentWindow
    this.appId = sessionStorage.getItem('atpAppId')
    this.packageId = sessionStorage.getItem('atpPackageId')
    this.taskId = sessionStorage.getItem('atpTaskId')
    this.searchAppTestAciton()
  },
  destroyed () {
    sessionStorage.removeItem('testAgain')
  },
  watch: {
    '$i18n.locale': function () {
      this.sendLanguageMessage()
    }
  }
}
</script>

<style lang='less'>
.appTest{
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  min-width: 1200px;
  align-items: center;
  .atp{
    width: 73.64%;
    margin: 0 auto;
    min-width: 1200px;
    height: 950px;
  }
  .appTestTop{
    width: 73.64%;
    margin: 60px 13.18% 20px 13.18%;
    min-width: 1200px;
    display: flex;
    justify-content: space-between;
    .appTestTitle{
      line-height: 50px;
      margin-bottom:0px ;
    }
    .backAppStore{
      width: 222px;
      height: 50px;
      background: linear-gradient(122deg, #4444D0, #6724CB);
      border-radius: 25px;
      padding: 4px 10px;
      font-size: 20px;
      font-family: HarmonyHeiTi, sans-serif;
      font-weight: 300;
      color: #FFFFFF;
      border: 1px solid #6724CB;
      box-shadow: 0px 16px 8px rgba(94, 44, 204, 0.3);
    }
  }
  .appChanegContent{
    width: 100%;
    height: 632px;
  }
}
</style>
